{extend name="public/base" /}
{block name="style"}
{load href="/static/common/js/zTree/zTreeStyle/zTreeStyle.css"}
<style>
    .ztree * {
        font-size: 14px;
    }
</style>
{/block}
{block name="title"}
<h1>授权</h1>
{/block}
{block name="content"}
<section class="content">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-info">
                <div class="box-header">
                </div>
                <form class="form-horizontal" action="{:url('role/authority')}" method="post" id="subForm">
                    <input type="hidden" name="id" value="{$id}">
                    <div class="box-body">
                        <div class="form-group">
                            <div class="col-md-offset-2 col-md-4">
                                <ul id="menuTree" class="ztree"></ul>
                                <input type="hidden" id="selectedId" name="selectedId">
                                <input type="hidden" id="selectedName" name="selectedName">
                            </div>
                        </div>
                    </div>
                    <div class="box-footer">
                        <a href="javascript:" class="btn btn-default" onclick="doGoBack()">
                            <i class="fa fa-arrow-left"></i>返回
                        </a>
                        <button type="submit" class="btn btn-primary col-md-offset-3">
                            <i class="fa fa-save"></i>保存
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>
{/block}
{block name="script"}
{load href="/static/common/js/zTree/js/jquery.ztree.core.js"}
{load href="/static/common/js/zTree/js/jquery.ztree.excheck.js"}
<script type="text/javascript">
    var doGoBack = function () {
        history.go(-1);
    };
    var setting = {
        view: {
            fontCss: getFont
        },
        check: {
            enable: true
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        callback: {
            onCheck: onCheck
        }
    };
    function getFont(treeId, node) {
        return node.font ? node.font : {};
    }
    function onCheck() {
        var zTree = $.fn.zTree.getZTreeObj("menuTree");
        var nodes = zTree.getCheckedNodes(true);
        var idArr = [];
        var nameArr = [];
        for (var i=0; i<nodes.length; i++) {
            idArr.push(nodes[i].id);
            nameArr.push(nodes[i].name);
        }
        $('#selectedId').val(idArr);
        $('#selectedName').val(nameArr);
    }
    $(document).ready(function(){
        $.fn.zTree.init($("#menuTree"), setting, JSON.parse('{php}echo $tree;{/php}'));
        var zTree = $.fn.zTree.getZTreeObj("menuTree");
        var type = { "Y" : "p", "N" : "s" };
        zTree.setting.check.chkboxType = type;
        onCheck();
    });
</script>
{/block}